<template>
    <div>
        <h3>子组件</h3>
        <p>{{ mky }}</p>
    </div>
</template>

<script setup lang="ts">

// 非ts
// defineProps({
//     mky:{
//         type:Number,
//         required:true
//     }
// })

// 接受父组件传递数据
// 说明:defineProps是个泛型函数,可以通过传递泛型变量指定props类型
// 解构赋默认值
const { mky = 100 } = defineProps<{
    mky: number
}>()

console.log('解构获取父传子变量:', mky)

// 如果提供的默认值需要在模板中渲染(解构的默认值模板中默认不显示)，需要额外添加配置，才能正常显示默认值
// 在vite.config.ts中添加:
// export default {
//   plugins: [
//     vue({
//       reactivityTransform: true
//     })
//   ]
// }



// 子传父修改父组件数据
const emit = defineEmits<{
    // eventName 子传父事件名字 data指定子传父数据类型
    (eventName: 'change-mky', data: number,data2:number): void
    (eventName: 'change-qt', data: number): void
}>()

emit("change-mky", 1e8,100)



</script>

<style scoped></style>